
.mint-popup
  position: fixed;
  background: #fff;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  backface-visibility: hidden;
  transition: .2s ease-out;

.mint-popup-top
  top: 0;
  right: auto;
  bottom: auto;
  left: 50%;
  transform: translate3d(-50%, 0, 0);

.mint-popup-right 
  top: 50%;
  right: 0;
  bottom: auto;
  left: auto;
  transform: translate3d(0, -50%, 0);

.mint-popup-bottom 
  top: auto;
  right: auto;
  bottom: 0;
  left: 50%;
  transform: translate3d(-50%, 0, 0);

.mint-popup-left 
  top: 50%;
  right: auto;
  bottom: auto;
  left: 0;
  transform: translate3d(0, -50%, 0);

.popup-slide-top-enter, .popup-slide-top-leave-active 
  transform: translate3d(-50%, -100%, 0);

.popup-slide-right-enter, .popup-slide-right-leave-active 
  transform: translate3d(100%, -50%, 0);

.popup-slide-bottom-enter, .popup-slide-bottom-leave-active 
  transform: translate3d(-50%, 100%, 0);

.popup-slide-left-enter, .popup-slide-left-leave-active 
  transform: translate3d(-100%, -50%, 0);

.popup-fade-enter, .popup-fade-leave-active 
  opacity: 0;

